<head>
	<!--<meta charset="utf-8" />
	<link rel="stylesheet" href="/BackEndRecursosHumanos/app/webroot/css/smoothness/jquery-ui-1.10.3.custom.min.css" />
	
	<script type="text/javascript" src="/BackEndRecursosHumanos/app/webroot/js/jquery-1.9.1.js"></script>
	<script type="text/javascript" src="/BackEndRecursosHumanos/app/webroot/js/jquery-ui-1.10.3.custom.min.js"></script>
	
	<script src="/BackEndRecursosHumanos/app/webroot/js/jquery.mousewheel.js"></script>
  	<script src="/BackEndRecursosHumanos/app/webroot/js/globalize.js"></script>-->
	<!--<link rel="stylesheet" type="text/css" href="/BackEndRecursosHumanos/app/webroot/css/ui-lightness/jquery-ui-1.10.3.custom.min.css">-->
	<!--<script type="text/javascript" src="/BackEndRecursosHumanos/app/webroot/js/jquery-ui-i18n.js"></script>-->
  	<!--<link rel="stylesheet" href="/BackEndRecursosHumanos/app/webroot/css/stylespinner.css" />-->
	
	<style>
	  .selectable_articulo .ui-selecting { background: #8C8E92; }
	  .selectable_articulo .ui-selected { background: #36393C; color: white; }
	  .selectable_articulo { list-style-type: none; margin: 0; width: 60%; }
	  

  	</style>
	
	<script>
		function click_evento($id) 
		{
	   		$('#AssignIdEvento').val($id);
	   		alert($id);
		}
		
	</script>
	<script>
	
	$(function() 
	{
    	$( "#CatalogoCantidadDisponible" ).spinner
	 		(
	 			{
	 				min: 1,
	 				increment: 'fast'
 				}
			);
			$( "#CatalogoPrecioUnitarioArticulo" ).spinner
	 		(
	 			{
	 				min: 1,
	 				increment: 'fast'
 				}
			);
    	
    	
    	
    	$( "#accordion" ).accordion(
    		{
    			 heightStyle: "content",
    			 collapsible: true
    		}
    	);   	
    	$( ".date-picker" ).datepicker(
		{
    		dateFormat: 'mm/dd/yy',
    		changeMonth: true,
			changeYear: true,
    	});
    	$( ".selectable_articulo" ).selectable(
			{
				
				selected: function(event, ui) { 
        			$(ui.selected).addClass("ui-selected").siblings().removeClass("ui-selected");           
    			}, 
				stop: function(event, ui) 
				{
				    var el_id = $(this).children("ol").attr("id");
		    
				    $('.selectable_articulo .ui-widget-content.ui-selected').each(function(index) 
				    {
     					$	
     					$('#CatalogoArticuloId').val($(this).attr('id'));
     					
					});
				    
				    $(".selectable_articulo ui-widget-content.ui-selected").not("#" + el_id).each(function(index, element) 
				    { 
				       	alert(index);
				       	$(element).toggleClass("ui-selected");
				        if($(element).children("li").hasClass("ui-selected"))
				        {
				           $(element).children("li").removeClass("ui-selected");
				           $('#CatalogoArticuloId').val($(element).children("li").attr("id"));
				           
				        }
				    });
				}
			});
		
    	
    	
  	});
	 
	</script>
	
	
</head>
<body >
	
	<center>
		<div>
	
			<center>
				<fieldset>
					<legend>Asignar un Articulo</legend>
					<table style="width: 100%">
						
						<tr>
							<td>
								<center>
									<div>
										<center>
											<b>Seleccione un Articulo</b>
											<br />	
											<br />	
											<div id="accordion">
											  <?php 
											  	$variable_control = 0;
											  	foreach ($Todos_Tipo_Articulos as $Tipo_Articulo) 
											  	{
													  
												
											  ?>
											  <h3><?php echo $Tipo_Articulo['TipoArticulo']['nombre_tipo_articulo']?></h3>
											  <div>
											    <p>
												    <table>
														<tr>
															<td style="text-align: center; vertical-align: middle;">
																<div>
																<ol id="selectable"  style="text-align: center; width: 100%;" class="selectable_articulo">
																<?php  
																	foreach ($Todos_Articulos as $Articulo) 
																	{
																		if ($Articulo['A']['tipo_articulo_id'] == $Tipo_Articulo['TipoArticulo']['id'])
																		{
																			$variable_control = 1;
																  			echo '<li id='.$Articulo['A']['id'].' class="ui-widget-content" >'.$Articulo['A']['nombre_articulo'].'</li>';
																		}
																	}
						
																	if($variable_control == 1)
																	{
																		$variable_control = 0;
																	}
																	else 
																	{
																  		echo '<ol style="font-style: italic; disable:"disable"><b>NO HAY ARTICULOS</b></ol>';
																	}	
																?>
																</ol>
																</div>
															</td>
														</tr>
													</table>
											    </p>
											  </div>
											
												<?php 
												}
												?>
												
											</div>
										</center>
									</div>
								</center>
							</td>
							
							<td style="width: 50%">
								<div>
									<?php echo $this->Form->create('Catalogo');?>
									<table >
										<input type="hidden" name="data[Catalogo][articulo_id]" value="" id="CatalogoArticuloId" >
										<input type="hidden" name="data[Catalogo][tienda_id]" value="1" id="CatalogoTiendaId" >
										<input type="hidden" name="data[Catalogo][tipo_disponibilidad_id]" value="1" id="CatalogoTipoDisponibilidadId" >
										<tr>
											<td>
												
												<table>
													<tr>
														<td style="text-align: right; vertical-align: middle">
															Cant. Max para Pedir:
														</td>
														<td style="vertical-align: middle">
															<center>
																<input style="text-align: center; width: inherit;"  name="data[Catalogo][cantidad_disponible]"   value="1"  id="CatalogoCantidadDisponible">
															</center>
														</td>
														<td style="vertical-align: middle; text-align: left;">
															<center>
															Unidad(es).
															</center>
														</td>
													</tr>
													<tr>
														<td style="text-align: right; vertical-align: middle">
															Precio:
														</td>
														<td style="vertical-align: middle">
															<center>
																<input style="text-align: center; width: inherit;" name="data[Catalogo][precio_unitario_articulo]"  value="1" id="CatalogoPrecioUnitarioArticulo" > 
															</center>
														</td>
														<td style="vertical-align: middle">
														<center>
															BsF.
														</center>
																
																	<?php /*echo $this->Form->input('moneda_id',array(
																																'options' => array($tipomoneda),
																																'styles' => array('vertical-align: middle;'),
																																'label' => array(
																																					'style' => 'display: none;'
																																				)
																															)
																									)
																			*/?>
																
															
														</td>
													</tr>
												</table>
											</td>
										</tr>
										<tr>
											<td>
												<center>
													<?php echo $this->Form->end('Asignar Articulo');?>
												</center>
												
											</td>
										</tr>
									</table>
									
									
									
											
																   
											
								</div>
							</td>
							
						</tr>
			
					</table>
				</fieldset>
			</center>
		</div>
	</center>
</body>